<template>
  <div>
    <el-button class="prev" pian @click="add">添加仓库</el-button>
    <el-table :data="warehouseInfos">
      <el-table-column prop="id" label="编号"></el-table-column>
      <el-table-column prop="warName" label="仓库名"></el-table-column>
      <el-table-column label="可提供的商品分类">
        <template slot-scope="scope">
          <el-popover
            placement="top-start"
            title="分类如下："
            width="200"
            trigger="hover"
            :content="scope.row.allWarehouseClassificationName">
            <el-button slot="reference">查看仓库指定的分类</el-button>
          </el-popover>
        </template>
      </el-table-column>
      <el-table-column prop="warMaxStock" label="仓库最大库存"></el-table-column>
      <el-table-column prop="remnantInventory" label="所剩库存"></el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-dropdown split-button type="primary" @click="viewDetails(scope.row.id)">
            查看详情
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item >
                <el-button size="mini" type="warning" @click="update(scope.row)">修改仓库</el-button>
              </el-dropdown-item>
              <el-dropdown-item>
                <el-button size="mini" type="danger" @click="Delete(scope.row)">删除仓库</el-button>
              </el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </template>
      </el-table-column>
    </el-table>
    <div>
      <!-- 分页 -->
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="pageno"
        :page-sizes="[5, 10, 15, 20]"
        :page-size="pagesize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total"
      >
      </el-pagination>
    </div>
    <addWarehouseInfo ref="addWarehouseInfo"></addWarehouseInfo>
    <WarehouseDetailsInfo_dialog ref="WarehouseDetailsInfo_dialog"></WarehouseDetailsInfo_dialog>
    <updateWarehouseInfo ref="updateWarehouseInfo"></updateWarehouseInfo>
  </div>
</template>

<script>
    import addWarehouseInfo from "./addWarehouseInfo";
    import WarehouseDetailsInfo_dialog from "./WarehouseDetailsInfo_dialog";
    import updateWarehouseInfo from "./updateWarehouseInfo";
    export default {
        name: "WarehouseInfoList",
        data(){
          return {
            warehouseInfo:{
              id:"",
              isCheck:1,//通过审核
              isDelete:0//未被删除
            },
            warehouseInfos:[],
            pageno: 1,
            pagesize: 5,
            total: 1
          }
        },
        methods:{
          getData(){
            let params=new URLSearchParams();
            params.append("pageno", this.pageno);
            params.append("pagesize", this.pagesize);
            Object.keys(this.warehouseInfo).forEach(item=>{
              params.append(item,this.warehouseInfo[item]);
            })
            //异步，查询未被删除，并且通过审核的仓库
            this.$axios.get("warehouseInfo/warehouseInfo.action",{params:this.warehouseInfo}).
            then((response)=> {   //异步调用成功执行
              //将查询到的数据存入对象数组中
              this.warehouseInfos=response.data.records;
              this.total = response.data.total;
            }).catch(function (error) {//异步调用失败执行
              alert(error);
            });
          },
          viewDetails(id){
            //打开对话框
            this.$refs.WarehouseDetailsInfo_dialog.open();
            //延迟加载，调用加载函数
            this.$nextTick(item=>{
              this.$refs.WarehouseDetailsInfo_dialog.getData(id);
            })
          },
          add(){
            //打开对话框
            this.$refs.addWarehouseInfo.openDialog();
            //延迟加载，调用加载函数
            this.$nextTick(item=>{
              this.$refs.addWarehouseInfo.getData();
            })
          },
          update(row){
            //打开对话框
            this.$refs.updateWarehouseInfo.dialogFormVisible=true;
            this.$nextTick(item=>{
              this.$refs.updateWarehouseInfo.warehouse.id=row.id;
              this.$refs.updateWarehouseInfo.getdata();
            })

          },
          Delete(row){
            this.$confirm('是否删除该仓库?', '提示', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'warning'
            }).then(() => {
              /*var params = new URLSearchParams();
              params.append("id",row.id)*/
              /*{params:params}*/
              this.$axios.put("warehouseInfo/querybyidUpdateWarehouseInfo.action/"+row.id).then(res=>{
                if (res.data.code>0){
                  this.$message.success(res.data.msg);
                  this.getData();
                }else {
                  this.$message.error(res.data.msg)
                }
              }).catch(error=>{
                this.$message.error(error)
              })
            }).catch();
          },
          handleSizeChange(val) {
            //每页范围
            this.pagesize = val;
            this.getShopData();
          },
          handleCurrentChange(val) {
            //当前页
            this.pageno = val;
            this.getShopData();
          }
        },
        created() {
          this.getData();
        },
        components:{
            addWarehouseInfo,WarehouseDetailsInfo_dialog,updateWarehouseInfo
        }
    }
</script>

<style scoped>
  .el-dropdown {
    vertical-align: top;
  }
  .el-dropdown + .el-dropdown {
    margin-left: 15px;
  }
  .el-icon-arrow-down {
    font-size: 12px;
  }
</style>
